<html>
  <head>
    <meta name="viewport" content="width=device-width, minimum-scale=1.0">
    <script>
      document.addEventListener("DOMContentLoaded", function(event) {
        document.getElementById("focusableElement1").addEventListener('focus', () => {
          window.domAutomationController.send('FocusDone1');
        });
        document.getElementById("focusableElement2").addEventListener('focus', () => {
          window.domAutomationController.send('FocusDone2');
        });
        document.getElementById("focusableElement3").addEventListener('focus', () => {
          window.domAutomationController.send('FocusDone3');
        });
      });
    </script>
    <style>
      p {
        position: absolute;
        left: 10000px;
        top: 10000px;
      }
    </style>
  </head>
  <body>
    <p id="text">
      <a href="#" id="focusableElement1">Test1</a>
      Some text
      <a href="#" id="focusableElement2">Test2</a>
      Even more
      <a href="#" id="focusableElement3">Test3</a>
    </p>
  </body>
</html>
